<template>
  <div>
    <el-form ref="form" :model="form" :rules="rules" label-width="80px">
        <el-row>
          <el-col :span="12">
            <el-form-item label="文章标题" prop="articleTitle">
              <el-input v-model="form.articleTitle" placeholder="请输入文章标题" />
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="状态">
              <el-radio-group v-model="form.status">
                <el-radio
                  v-for="dict in statusList"
                  :key="dict.value"
                  :label="dict.value"
                >{{dict.label}}</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="内容">
              <editor v-model="form.articleContent" :min-height="192"/>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="reset">重 置</el-button>
      </div>
  </div>
</template>

<script>

import { saveArticle } from "@/api/market/article";
export default {
  name: 'ArticleType',
  components: {

  },
  props: ['agreementInfo', 'statusList', 'articleType'],
  data() {
    return {
      // 表单参数
      form: {
        shopId: "",
        articleTitle: "",
        articleContent: "",
        status: '0',
      },
      // 表单校验
      rules: {
      }
    }
  },
  watch: {
    agreementInfo(value) {
      if (value && JSON.stringify(value) !== "{}") {
        this.form = value
      }else{
        this.reset()
      }
    }
  },
  mounted(){
  },
  methods: {
    // 表单重置
    reset() {
      this.form = {
        shopId: "",
        articleTitle: "",
        articleContent: "",
        status: '0',
      };
      this.resetForm("form");
    },
    /** 提交按钮 */
    submitForm: function() {
      this.$refs["form"].validate(valid => {
        if (valid) {
          let params = JSON.parse(JSON.stringify(this.form))
          params.articleType = this.articleType
          saveArticle(params).then(response => {
              this.$modal.msgSuccess("保存成功");
            });
        }
      });
    },
  }
}
</script>

<style lang="scss" scoped>
.width300{
  width: 300px;
}
</style>
